/*
 * Copyright 2019 ThoughtWorks, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
* {
    text-align: left;
}
html,
body {
    background-color: #343226;
}
/* layout start */
#doc {
    width: auto;
    background-color: #e7e1d1;
    margin: 0 1em;
}

.yui-t3 .yui-b {
    width: 27em;
    *width : 27.52em;
}

.yui-t3 #yui-main .yui-b {
    margin-left: 27em;
    *margin-left : 27.52em;
    border-left: 1px solid white;
    *broder-left : none;
}

.yui-t1 #yui-main, .yui-t2 #yui-main, .yui-t3 #yui-main {
    margin-left: -27em;
    *margin-left : -27.52em;
}

.experimental {
    border: 2px solid red !important;
    background-color: pink !important;
}
/* common styles */
.clear {
    display: block;
    clear: both;
    font-size: 0;
    line-height: 0;
    height: 0;
    width: 0;
    overflow: hidden;
}

.clear-after:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

iframe {
    width: 100%;
    height: 30em;
    border: none;
}
/* header styles */
#header {
    background-color: #343226;
    color: white;
    margin-left: 1em;
    margin-right: 1em;
}
#header a:link,
#header a:visited {
    color: white;
}
#header h1 {
    font-size: 3em;
}
#logo {
    display: block;
    text-indent: -10000px;
    zoom: 1;
    overflow: hidden;
    position: absolute;
    top: 20px;
    left: 1em;
}
.logo-enterprise {
    background-image: image_url('logo-cruise-enterprise.png');
    background-repeat: no-repeat;
    width: 99px;
    height: 37px;
}

.links,
.principal {
    min-height: 45px;
    float: right;
    margin-left: 1em;
}
.links li,
.principal li {
    display: inline;
    padding: 0.25em 0 0.25em 0.5em;
}

.tabs {
    display: block;
    float: right;
    clear: right;
    border: 1px solid #5c5952;
    border-bottom: none;
    padding: 0.5em 0;
}
.tabs li {
    display: inline;
    border: 1px solid #343226;
    border-right: none;
    background-color: #444034;
    padding: 0.5em 0;
}
.tabs .current {
    background-color: #aea888;
}
.tabs .admin {
    background-color: #242111;
}
#header .tabs li {
    background-image: image_url('bg-header-tabs.png');
    background-repeat: repeat-x;
    background-position: left 50%;
}
#header .tabs .admin {
    background-image: image_url('bg-header-tabs-admin.png');
}
#header .tabs .current {
    background-image: image_url('bg-header-tabs-current.png');
    background-position: left top;
}
.tabs li a,
.tabs li span {
    padding: 0.5em 1em;
    text-decoration: none;
}

a.sign-out {
    background: transparent no-repeat scroll center left;
    line-height: 1.3em;
    padding: 2px 5px 2px 17px;
}

a.sign-out {
    font-weight: bold;
    background-image: image_url('icon-sign-out.gif');
}

/* footer styles */
#footer {
    margin: 1em;
}
#footer,
#footer a:link,
#footer a:visited {
    color: white;
}
.copyright {
    float: left;
}
#footer .links {
    clear: right;
}

/* Modal window styles */
/* Overlay */
#confirmModalOverlay {
    background-color: #eee;
    cursor: wait;
}

/* Container */
#confirmModalContainer {
    height: 140px;
    width: 420px;
    font-family: 'Trebuchet MS', Verdana, Arial;
    font-size: 16px;
    text-align: left;
    background: #fff;
    border: 2px solid #343226;
}

#confirmModalContainer .header {
    height: 30px;
    width: 100%;
    background: black;
    color: #fff;
    font-size: 1.1em;
    font-weight: bold;
    line-height: 30px;
}

#confirmModalContainer .header span {
    padding-left: 8px;
}

#confirmModalContainer .message {
    color: #333;
    text-align: center;
    margin: 0;
    padding: 12px 4px;
    font-size: 1em;
}

#confirmModalContainer .buttons {
    width: 160px;
    float: right;
    padding: 10px 8px 0;
}

#confirmModalContainer .buttons div {
    float: right;
    margin-left: 8px;
    width: 70px;
    height: 26px;
    color: #666;
    font-weight: bold;
    text-align: center;
    background: url(../img/confirm/button.gif) repeat-x;
    border: 1px solid #bbb;
    cursor: pointer;
}

#confirmModalContainer a.modalCloseX,
    #confirmModalContainer a.modalCloseX:link,
    #confirmModalContainer a.modalCloseX:active,
    #confirmModalContainer a.modalCloseX:visited {
    text-decoration: none;
    font-weight: bold;
    font-size: 1.1em;
    position: absolute;
    top: -1px;
    left: 400px;
    color: #ddd;
}

#confirmModalContainer a.modalCloseX:hover {
    color: #9bb3b3;
}

#confirmModalContainer form {
    margin: 0.5em;
}

#confirmModalContainer input[type="text"] {
    display: block;
    width: 80%;
    margin: 0.5em;
}
